<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, maximum-scale=3"
    />
    <meta
      name="keywords"
      content="獭米技术, web技术, 前端技术, 獭米前端, 前端开发, 前端开发文档"
    />
    <meta
      name="description"
      content="此版技术文档命名为《獭米 web 技术文档》，它基于原来个人编写并为职业技术培训机构服务的《Web 前端入门教程》。重新编写一版技术文档的目的在于：重构出更为清晰的知识框架以及更易于使用的导航，梳理出由浅入深的学习理解过程，编写出更易于理解和贴合实际使用的代码案例等等"
    />
    <meta name="author" content="獭米网络-欧冷斯" />
    <meta name="robots" content="index" />
    <meta name="copyright" content="Copyright © 2025 獭米网络" />
    <meta name="generator" content="Trae - Gulp 5.0 自动化构建" />
    <!-- 社交媒体分享信息 -->
    <meta property="og:title" content="獭米 web 技术文档" />
    <meta
      property="og:description"
      content="此版技术文档命名为《獭米WEB技术文档》，它基于原来个人编写并为职业技术培训机构服务的《Web 前端入门教程》。重新编写一版技术文档的目的在于：重构出更为清晰的知识框架以及更易于使用的导航，梳理出由浅入深的学习理解过程，编写出更易于理解和贴合实际使用的代码案例等等"
    />
    <meta property="og:image" content="./images/open-graph-logo.jpg" />
    <meta property="og:url" content="https://www.aulence.com/" />
    <meta property="og:site_name" content="獭米网络" />
    <link rel="shortcut icon" href="favicon.ico" />
    <link rel="Bookmark" href="favicon.ico" />
    <title>獭米Web技术文档</title>
    <link rel="stylesheet" href="./styles/common.css" />
    <link rel="stylesheet" href="./styles/index.css" />
  </head>

  <body>
    <!-- 网站页头 -->
    @@include('./public/header.html', {
      "indexPath": ".",
      "childPath": "./pages"
    })

    <!-- 内容主体 -->
    <main class="index">
      <article>
        <h1>獭米Web技术文档</h1>

        <section>
          <h2>獭米Web技术文档简介</h2>
          <p>
            此版技术文档命名为《獭米WEB技术文档》，它基于原来个人编写并为<em class="annotated" data-title="成都睿峰科技有限公司旗下睿峰培训教育团队">职业技术培训机构</em>服务的《Web 前端入门教程》。重新编写一版技术文档的目的在于：
          </p>
          <ol>
            <li>重构出更为清晰的知识框架以及更易于使用的导航</li>
            <li>梳理出由浅入深的学习理解过程</li>
            <li>编写出更易于理解和贴合实际使用的代码案例</li>
          </ol>
          <p>
            如果您需要软件开发方面的支持和帮助，可以前往我们的<a
              href="https://www.tami-network.com/"
              target="_blank"
              >官方网站</a
            >获得进一步的了解。
          </p>
        </section>

        <section class="site-navigation">
          <h2>技术文档导航</h2>
          <p>
            以下是本站主要内容的导航面板，您可以根据需要点击对应的链接进行跳转：
          </p>
          <ul>
            <li>
              <a class="nav-cover html" href="#" aria-label="HTML">HTML</a>
            </li>
            <li>
              <a class="nav-cover css" href="#" aria-label="CSS">CSS</a>
            </li>
            <li>
              <a class="nav-cover javascript" href="#" aria-label="JavaScript">JavaScript</a>
            </li>
          </ul>
        </section>

      </article>
    </main>

    <!-- 网站页脚 -->
    @@include('./public/footer.html', {
      "indexPath": ".",
      "childPath": "./pages"
    })

    <!-- JavaScript文件 -->
    <script type="module" src="./scripts/common-script.js"></script>
    <script type="module" src="./scripts/index.js"></script>
  </body>
</html>
